window.readDetail = new Vue({
    el: '#exerciseDetail',
    data() {
        return {
            second: 0,//
            time: '00:00:00',//做题时长
            interVal: '',//
            isFull: false,//是否全屏
            isPop: true,//顶部提示
            isPlay: false,//是否在播放中
            audio: '',//音频对象
            isOriginal: false,//是否显示原文
            current: 0,//当前题目序号
            left: '',//
            display: 'none',//

            dataQuestion: '', //json数据
            content_id: '',//当前整套题目content_id
            content_btn: '',//当前小题目content_id
            content_btn_status: '',//当前小题目 方形 圆形
            content_pid: '',//当前题目pid
            letterArry: [], //序号  26个字母
            AnswerArry: [], //通用答案数组
            confirmPop: false,//交卷提示
            doLength: 0,//已经做了多少题
        }
    },
    created() {
        let that = this;

        that.getData();
        for (var i = 65; i < 91; i++) {
            that.letterArry.push(String.fromCharCode(i));
        }

    },
    mounted() {
        let that = this;
        that.$nextTick(function () {

        });
    },
    destroyed() {

    },
    methods: {

        //获取初始数据
        getData() {
            let that = this;
            $.get('/cn/exercise/read-exercise', {
                content_id: $('#content_id').val(),
            }, function (res) {
                if (res.code == 1) {
                    that.content_id = $('#content_id').val();
                    that.initData(res);
                } else {
                    alert(res.message)
                }
            }, 'json')
        },
        //初始化做题数据处理
        initData(data) {
            let that = this;
            that.dataQuestion = data;
            that.dataQuestion.topic.map((train, index) => {
                let arry = [];
                that.AnswerArry.push(arry);
                //<!--多选题 numbering 1  填空题 numbering 2  判断题 numbering 3   打勾题 numbering 4   图片填空 numbering 5  选项拖拽题 numbering 6  单选 numbering 7  大纲拖拽题 numbering 8-->

                if (train.parent.numbering == 4) { //打钩题
                    train.parent.article = train.parent.article.replace(/<\/?.+?>/g, "").replace(/ /g, "");
                }
                if (train.parent.numbering == 7 || train.parent.numbering == 3 || train.parent.numbering == 4) { //单选题  打勾题  是非判断 都看作单项选择题

                } else if (train.parent.numbering == 1) { //多选选择题 1

                } else if (train.parent.numbering == 2) { //填空题 2
                    train.parent.article = train.parent.article.replace(/#&/g, '#&*');
                    train.parent.article = train.parent.article.split('*');

                    let last = train.parent.article[train.parent.article.length - 1];
                    train.parent.article = train.parent.article.slice(0, train.parent.article.length - 1);

                    for (var i in train.parent.article) {
                        if(train.son[i].judge == '1'){
                            train.parent.article[i] = train.parent.article[i].replace(/#&/g,
                                "<input type='text' value='"+ train.son[i].my_answer +"' readonly placeholder='" + train.son[i].name + "' class='BlankInput rightInput' id='listen_" + train.son[i].content_id + "' >")
                        }else if(train.son[i].judge == '0'){
                            train.parent.article[i] = train.parent.article[i].replace(/#&/g,
                                "<input type='text' value='"+ train.son[i].my_answer +"' readonly placeholder='" + train.son[i].name + "' class='BlankInput falseInput' id='listen_" + train.son[i].content_id + "' >")
                        }else {
                            train.parent.article[i] = train.parent.article[i].replace(/#&/g,
                                "<input type='text' value='未作答' readonly placeholder='" + train.son[i].name + "' class='BlankInput falseInput' id='listen_" + train.son[i].content_id + "' >")
                        }

                    }
                    let str = '';

                    for (var i in train.parent.article) {
                        str += train.parent.article[i];
                    }
                    train.parent.article = str + last;

                } else if (train.parent.numbering == 8) { //除开单选多选打勾题 都按填空处理
                    train.parent.description = train.parent.description.replace(/#&/g, '#&^*');

                    train.parent.description = train.parent.description.split('^*');
                    let last = train.parent.description[train.parent.description.length - 1];
                    train.parent.description = train.parent.description.slice(0, train.parent.description.length - 1);
                    for (var i in train.parent.description) {
                        if(train.son[i].judge == '1'){
                            train.parent.description[i] = train.parent.description[i].replace(/#&/g,
                                "<input type='text' readonly value='"+ train.son[i].my_answer +"' placeholder='" + train.son[i].name + "' class='headInput rightInput' id='listen_" + train.son[i].content_id + "'>");
                        }else if(train.son[i].judge == '0'){
                            train.parent.description[i] = train.parent.description[i].replace(/#&/g,
                                "<input type='text' readonly value='"+ train.son[i].my_answer +"' placeholder='" + train.son[i].name + "' class='headInput falseInput' id='listen_" + train.son[i].content_id + "'>");
                        }else {
                            train.parent.description[i] = train.parent.description[i].replace(/#&/g,
                                "<input type='text' readonly value='未作答' placeholder='" + train.son[i].name + "' class='headInput falseInput' id='listen_" + train.son[i].content_id + "'>");
                        }

                    }
                    let str = '';
                    for (var i in train.parent.description) {
                        str += train.parent.description[i];
                    }
                    that.dataQuestion.article.description = train.parent.description = str + (last != '' && last ? last : '');

                } else if (train.parent.numbering == 5) {//图片填空
                    train.parent.image = 'https://ielts.thinkwithu.com' + train.parent.image;

                } else if (train.parent.numbering == 6) {//选项拖拽
                    train.parent.article = train.parent.article.replace(/#&/g, '#&*');
                    train.parent.article = train.parent.article.split('*');
                    let articleEnd = $.trim(train.parent.article[train.parent.article.length - 1]);
                    train.parent.article = train.parent.article.slice(0, train.parent.article.length - 1);
                    for (var i in train.parent.article) {
                        if(train.son[i].judge == '1') {//做对
                            train.parent.article[i] = train.parent.article[i].replace(/#&/g,
                                "<input type='text' value='"+ train.son[i].my_answer +"' placeholder='" + train.son[i].name + "' readonly class='headInput rightInput'  id='listen_" + train.son[i].content_id + "' >");
                        }else if(train.son[i].judge == '0'){
                            train.parent.article[i] = train.parent.article[i].replace(/#&/g,
                                "<input type='text' value='"+ train.son[i].my_answer +"' placeholder='" + train.son[i].name + "' readonly class='headInput falseInput'  id='listen_" + train.son[i].content_id + "' >");
                        }else {
                            train.parent.article[i] = train.parent.article[i].replace(/#&/g,
                                "<input type='text' value='未作答' placeholder='" + train.son[i].name + "' readonly class='headInput falseInput'  id='listen_" + train.son[i].content_id + "' >");
                        }
                    }
                    let str = '';
                    for (var i in train.parent.article) {
                        str += train.parent.article[i];
                    }
                    let endCheck = articleEnd.replace(/<\/?.+?>/g, "").replace(/ /g, "");
                    if (endCheck && endCheck != '.') {
                        str += articleEnd;
                    }
                    train.parent.article = str;

                }

            });
            console.log(that.AnswerArry)
        },

        //当前
        getDoNow(content_id) {
            let that = this;
            console.log('content_id', content_id);
            that.dataQuestion.question_list.map((item, index) => {
                if (item.content_id == content_id) {
                    that.current = index;
                    that.content_btn = content_id;
                }
            })
        },
        //上一题
        prev() {
            let that = this;
            if (that.current > 0) {
                that.current = that.current - 1;
                that.dataQuestion.question_list.map((item, index) => {
                    if (index == that.current) {
                        that.content_btn = item.content_id;
                        document.getElementById('listen_' + that.content_btn).scrollIntoView({
                            block: "center",
                            behavior: "smooth"
                        })
                    }
                })
            }
        },
        //下一题
        next() {
            let that = this;
            if (that.current < that.dataQuestion.question_list.length - 1) {
                that.current = parseInt(that.current) + 1;
                that.dataQuestion.question_list.map((item, index) => {
                    if (index == that.current) {
                        that.content_btn = item.content_id;
                        document.getElementById('listen_' + that.content_btn).scrollIntoView({
                            block: "center",
                            behavior: "smooth"
                        })
                    }
                })
            }
        },
        //按钮点击滚动
        welter(pid, content_id, index, status) {
            this.current = index;//当前正在看的题目
            this.content_btn_status = status;//当前正在看的题目的状态  0方形 1 圆形
            this.content_btn = content_id;
            this.content_pid = pid;
            document.getElementById('listen_' + content_id).scrollIntoView({block: "center", behavior: "smooth"})
        },
        //浮窗跟随
        followIn(e) {
            let that = this;
            let left = $(e.target).offset().left - $(e.target).parent().offset().left;//子元素在父元素中的偏移量
            that.left = left;
            that.display = 'flex';
        },
        followOut(e) {
            let that = this;
            that.left = '';
            that.display = 'none';
        },
        //展开折叠
        toggle(e) {
            if ($(e.target).hasClass('spinOut')) {
                $(e.target).removeClass('spinOut');
            } else {
                $(e.target).addClass('spinOut');
            }
            $(e.target).parents('.ItemIn').find('.singleZt').slideToggle();
        },

        //  全屏、退出全屏
        launchFullscreen() {
            let that = this;
            let element = document.documentElement;
            if (!that.isFull) {
                if (element.requestFullscreen) {
                    element.requestFullscreen();
                } else if (element.mozRequestFullScreen) {
                    element.mozRequestFullScreen();
                } else if (element.webkitRequestFullscreen) {
                    element.webkitRequestFullscreen();
                } else if (element.msRequestFullscreen) {
                    element.msRequestFullscreen();
                }
                that.isFull = true;
            } else {
                if (document.exitFullscreen) {
                    document.exitFullscreen();
                } else if (document.mozCancelFullScreen) {
                    document.mozCancelFullScreen();
                } else if (document.webkitExitFullscreen) {
                    document.webkitExitFullscreen();
                }
                that.isFull = false;
            }
        },
        //时间转换
        formateSeconds(endTime) {
            let secondTime = parseInt(endTime);//将传入的秒的值转化为Number
            let min = 0;// 初始化分
            let h = 0;// 初始化小时
            let result = '';
            if (secondTime > 60) {//如果秒数大于60，将秒数转换成整数
                min = parseInt(secondTime / 60);//获取分钟，除以60取整数，得到整数分钟
                secondTime = parseInt(secondTime % 60);//获取秒数，秒数取佘，得到整数秒数
                if (min > 60) {//如果分钟大于60，将分钟转换成小时
                    h = parseInt(min / 60);//获取小时，获取分钟除以60，得到整数小时
                    min = parseInt(min % 60);//获取小时后取佘的分，获取分钟除以60取佘的分
                }
            }
            result = `${h.toString().padStart(2, '00')}:${min.toString().padStart(2, '00')}:${secondTime.toString().padStart(2, '00')}`;
            return result;
        }
    }
});
